import type { FC } from 'react';
import style from './index.less';
import React, { Fragment, useState, useEffect } from 'react';
import { Typography } from 'antd';
import IconFont from '@/components/Icon';
import { getAllArticleLike, getAuthorPv } from './service';
const { Title } = Typography;

interface Props {}

const Achievement: FC<Props> = () => {
  const user_id = localStorage.getItem('user_id');
  const [pv, setPv] = useState(0);
  const [liked, setLikd] = useState(0);
  useEffect(() => {
    getAuthorPv({ user_id }).then(res => {
      console.log(res.data.count);
      setPv(res.data.count);
    });
    getAllArticleLike({ user_id }).then(res => {
      setLikd(res.res[0].count)
    });
  }, []);
  return (
    <div className={style.ach_con}>
      <div className={style.header}>
        <h3>个人成就</h3>
      </div>
      <div className={style.content}>
        <div className={style.data}>
          <div className={style.icon}>
            <IconFont type="icona-dianzan1" style={{ fontSize: '25px' }} />
          </div>
          <div className={style.text}>文章被点赞: {liked} </div>
        </div>
        <div className={style.data}>
          <div className={style.icon}>
            <IconFont type="icona-yuedudushushu" style={{ fontSize: '25px' }} />
          </div>
          <div className={style.text}>文章被阅读 : {pv}</div>
        </div>
        <div className={style.data}>
          <div className={style.icon}>
            <IconFont type="iconHP" style={{ fontSize: '25px' }} />
          </div>
          <div className={style.text}>HP值</div>
        </div>
      </div>
    </div>
  );
};

export default Achievement;
